<cfoutput>

<cfif not isDefined("session.id")>
    <h3>Enter your Details to Login</h3>

	<style type="text/css">
		.table{
		
		}
		
		.row{
			
		}
		
		.data{
			display: inline-block;
		}
		
		.rowHead{
			width: 100px;
		}
	</style>
<div class="table">
	<div class="row">
		<div class="data">
			<form id="getname" action="/ecada/login.cfm" method="post" id="ff">
				<div class="table">
					<div class="row">
						<div class="data rowHead">Username:</div>
						<div class="data">
							<input type="text" id="em" name="username" size="40" />
						</div>
					</div>
					<div class="row">
						<div class="data rowHead">Password:</div>
						<div class="data">
							<input type="password"  name="thepassword" size="40" />
						</div>
					</div>
					<div class="row">
						<div class="data" style="float: right;">
							<button class="ui-state-default ui-corner-all" title="Login" type="Submit" value="Login" onclick="">
								<div>
									<div style="float: left; margin-top: 3px; margin-left: 3px;" class="ui-icon ui-icon-arrowthick-1-e"></div>
									<div style="display: inline-block; margin: 3px;line-height: 16px;"><b>Login</b></div>
								</div>
							</button>
						</div>
						<div class="data" style="float: right;">
							<button class="ui-state-default ui-corner-all" title="Forgot Username" type="Button" value="Login" onclick="getUsername();">
								<div>
									<div style="float: left; margin-top: 3px; margin-left: 3px;" class="ui-icon ui-icon-arrowturnthick-1-e"></div>
									<div style="display: inline-block; margin: 3px;line-height: 16px;"><b>Forgot Username</b></div>
								</div>
							</button>
						</div>
						<div class="data" style="float: right;">
							<button class="ui-state-default ui-corner-all" title="Forgot Password" type="Button" value="Forgot Password" onclick="getPassword();">
								<div>
									<div style="float: left; margin-top: 3px; margin-left: 3px;" class="ui-icon ui-icon-arrowturnthick-1-e"></div>
									<div style="display: inline-block; margin: 3px;line-height: 16px;"><b>Forgot Password</b></div>
								</div>
							</button>
						</div>
					</div>
				</div>
			</form>
			<script type="text/javascript">
			function getUsername()
			{
				$( "##gtUname" ).dialog({
					resizable: false,
					height:400,
					width: 400,
					modal: true,
					buttons: {
						Submit: function() {
							$('##uNameget').submit();
							$( this ).dialog( "close" );
						},
						Cancel: function() {
							$( this ).dialog( "close" );
						}
					}
				});
			}
			function getPassword()
			{
				$( "##gtPword" ).dialog({
					resizable: false,
					height:400,
					width: 400,
					modal: true,
					buttons: {
						Submit: function() {
							$('##Passget').submit();
							$( this ).dialog( "close" );
						},
						Cancel: function() {
							$( this ).dialog( "close" );
						}
					}
				});
			}
			</script>
			<div id="gtUname" name="gtUname" style="display: none;" title="Retrieve Username">
				<form id="uNameget" name="uNameget" method="post" action="getUserName.cfm">
					<div class="table">
						<div class="row">
							<div class="data">
								<p> Please enter the email address that you registered your ECADA account with.</p>
							</div>
						</div>
						<div class="row">
							<div class="data rowHead">
								E-mail
							</div>
							<div class="data">
								<input type="textbox" name="email" id="email">
							</div>
						</div>
					</div>
				</form>
			</div>
			

			<div id="gtPword" name="gtPword"style="display: none;">
				<form id="Passget" name="Passget" method="post" action="getPassword.cfm">
					<div class="table">
						<div class="row">
							<div class="data">
								<p> Please enter the email address and the username that you registered your ECADA account with.</p>
							</div>
						</div>
						<div class="row">
							<div class="data rowHead">
								E-mail
							</div>
							<div class="data">
								<input type="textbox" name="email" id="email">
							</div>
						</div>
						<div class="row">
							<div class="data rowHead">
								Username
							</div>
							<div class="data">
								<input type="textbox" name="username" id="username">
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>


<cfelse>
<cfif isDefined("session.name")>
<h1>Welcome, #session.name#</h1>
<cfelse>
<h2>ECADA</h2>
</cfif>
Choose options from the left, or
<a href="./../ecada/ce.cfm">Create a new experiment.</a><br/>

</cfif>

</cfoutput>
